<template>
  <div>
    <el-dialog
      @close="cancel"
      title="详情"
      :visible.sync="open"
      width="1000px"
      append-to-body
    >
      <el-form
        ref="elForm"
        disabled
        :model="formData"
        :rules="rules"
        size="medium"
        label-width="120px"
      >
        <h4 class="form-header h4">基本信息</h4>
        <el-row :gutter="15">
          <el-col :span="8">
            <el-form-item label="受控编号" prop="fileCode">
              <el-input
                v-model="formData.fileCode"
                placeholder="请输入受控编号"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="文件关键字" prop="keyword">
              <el-input
                v-model="formData.keyword"
                placeholder="请输入文件关键字"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="文件名称" prop="fileName">
              <el-input
                v-model="formData.fileName"
                placeholder="请输入文件名称"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="文件类型" prop="fileTypeValue">
              <el-select
                v-model="formData.fileTypeValue"
                placeholder="请选择文件类型"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_file_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="文件状态" prop="fileStatusValue">
              <el-select
                multiple
                v-model="formData.fileStatusValue"
                placeholder="请选择文件状态"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_file_status"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="文件废止日期" prop="endDate">
              <el-date-picker
                v-model="formData.endDate"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                :style="{ width: '100%' }"
                placeholder="请选择文件废止日期"
                clearable
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="文件实施日期" prop="startDate">
              <el-date-picker
                v-model="formData.startDate"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                :style="{ width: '100%' }"
                placeholder="请选择文件实施日期"
                clearable
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <h4 class="form-header h4">附件信息</h4>
        <el-form-item label="" prop="fileUrl">
          <FileUpload :isDelete="false" v-model="formData.fileUrl"></FileUpload>
        </el-form-item>
        <el-form-item label="关联个人" prop="isRel">
          <el-radio-group v-model="formData.isRel">
            <el-radio label="0">否</el-radio>
            <el-radio label="1">是</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          disabled
          v-if="formData.isRel == 1"
          label="员工姓名"
          prop="redDocVos"
        >
          <el-tag
            :key="index"
            v-for="(item, index) in nextUser"
            :disable-transitions="false"
          >
            {{ item.nickName }}
          </el-tag>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {
  fileManagerAdd,
  updategFileManager,
  fileManagerInfo,
} from "@/api/system/fileManager.js";
import { listSelect } from "@/api/business/project.js";
export default {
  dicts: ["sys_file_type", "sys_file_status"],

  props: {
    open: false,
    rowDetail: {},
    title: "",
    formData: {},
    disabled: false,
    nextUser: [],
  },
  data() {
    return {
      projectList: [],
      formData: {
        projectId: undefined,

        fileCode: undefined,
        userId: undefined,
        fileTypeValue: undefined,
        fileName: undefined,
        fileStatusValue: undefined,
        isApplyValue: undefined,
        endDate: null,
        startDate: null,
        keyword: "",
      },
      rules: {
        projectId: [
          {
            required: true,
            message: "请输入所属项目",
            trigger: "blur",
          },
        ],
        fileCode: [
          {
            required: true,
            message: "请输入受控编号",
            trigger: "blur",
          },
        ],
        keyword: [
          {
            required: false,
            message: "请输入关键字",
            trigger: "change",
          },
        ],
        fileTypeValue: [
          {
            required: true,
            message: "请选择文件类型",
            trigger: "change",
          },
        ],
        fileUrl: [
          {
            required: true,
            message: "附件不能为空",
            trigger: "change",
          },
        ],
        fileName: [
          {
            required: true,
            message: "请输入文件名称",
            trigger: "blur",
          },
        ],
        fileStatusValue: [
          {
            required: true,
            message: "请选择文件状态",
            trigger: "change",
          },
        ],
        endDate: [
          {
            required: false,
            message: "请选择文件废止日期",
            trigger: "change",
          },
        ],
        startDate: [
          {
            required: true,
            message: "请选择文件实施日期",
            trigger: "change",
          },
        ],
      },
    };
  },
  mounted() {},
  methods: {
    show(id) {
      this.open = true;
      this.listSelect();
      this.getinfo(id);
    },
    cancel() {
      this.open = false;
      this.$emit("update:open");
      this.$emit("cancel");
    },
    listSelect() {
      listSelect().then((response) => {
        this.projectList = response.data;
      });
    },
    getinfo(id) {
      fileManagerInfo(id).then((response) => {
        this.formData = response.data;
        this.formData.fileStatusValue =
          this.formData.fileStatusValue.split(",");
        if (this.formData.redDocVos) {
          let u = this.formData.redDocVos.map((item) => {
            return {
              nickName: item.nickName,
              userId: item.isRelUserId,
            };
          });
          this.nextUser = u;
        } else {
          this.nextUser = [];
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
::v-deep .el-tag + .el-tag {
  margin-left: 10px;
}
</style>
